<template>
	<div>
		<use-table ref="tbl" :tableRefs="$refs.etbl"></use-table>
		<div class="container_status dflex_vertical_c">
			<div class="item_interval" v-for="(item, i) in stateDatas" :key="i">
				<el-button class="badge_txt" :class="{ active: item.name == state }" size="small" @click="cutSta(item)">
					{{ item.name }}
				</el-button>
				<v-countup class="badge" start-value="0" :end-value="item.cnt"></v-countup>
			</div>
		</div>
		<div ref="advanced" class="container padding_b_0">
			<div class="dflex_wrap" style="transition: all 0.35s;">
				<div class="dflex_vertical_c margin_r_40 margin_b_20">
					<div class="search_name">订单号：</div>
					<el-input v-model.number="req.order_id" placeholder="请输入" type="number" class="search_input"
						@change="search" clearable oninput="value = parseInt(value)"></el-input>
				</div>
				<div class="dflex_vertical_c margin_r_40 margin_b_20">
					<div class="search_name">下单人：</div>
					<el-input v-model="req.order_member_name" placeholder="请输入" class="search_input" @change="search"
						clearable></el-input>
				</div>
				<div class="dflex_vertical_c margin_r_40 margin_b_20">
					<div class="search_name">下单人手机号：</div>
					<el-input v-model="req.order_member_mobile" placeholder="请输入" class="search_input" @change="search"
						clearable></el-input>
				</div>
				<div class="dflex_vertical_c margin_r_40 margin_b_20" v-if="advancedSearch">
					<div class="search_name">收货人：</div>
					<el-input v-model="req.order_consignee" placeholder="请输入" class="search_input" @change="search"
						clearable></el-input>
				</div>
				<div class="dflex_vertical_c margin_r_40 margin_b_20" v-if="advancedSearch">
					<div class="search_name">收货人手机号：</div>
					<el-input v-model="req.order_consignee_tel" placeholder="请输入" class="search_input" @change="search"
						clearable></el-input>
				</div>
				<div class="dflex_vertical_c margin_r_40 margin_b_20" v-if="advancedSearch">
					<div class="search_name">支付方式：</div>
					<el-select v-model="req.order_pay_way" class="search_input" @change="search">
						<el-option v-for="item in payOptions" :key="item.value" :label="item.label" :value="item.value">
						</el-option>
					</el-select>
				</div>
				<div class="dflex_vertical_c margin_r_40 margin_b_20" v-if="advancedSearch">
					<div class="search_name">下单时间：</div>
					<el-date-picker v-model="searchTime" type="daterange" align="right" range-separator="至"
						start-placeholder="开始日期" end-placeholder="结束日期" format="yyyy-MM-dd"
						:picker-options="pickerTimeOptions" class="search_start_end_time" @change="search">
					</el-date-picker>
				</div>
				<el-button size="mini" :loading="searchBtnLoading" class="search-btn margin_b_20 margin_r_40"
					@click="search">搜索</el-button>
				<div class="search_advanced margin_b_20" @click="advancedFilter" v-if="!advancedSearch">高级筛选</div>
				<div class="search_common margin_b_20" @click="advancedFilter" v-if="advancedSearch">常用筛选</div>
			</div>
		</div>
		<div class="container last_container use-table">
			<div class="dflex_sb margin_b_15 table-head">
				<el-button :disabled="!tableDatas.length > 0" type="success" plain :loading="exportsBtnLoading"
					@click="exports">导出<span v-if="selectDatas.length">×{{selectDatas.length}}</span></el-button>
			</div>
			<el-table ref="etbl" :height="tblHeight" v-loading="tableLoading" :data="tableDatas"
				@selection-change="selectionChange" highlight-current-row>
				<el-table-column type="selection" fixed="left"></el-table-column>
				<el-table-column label="订单号" align="center" width="200">
					<template scope="scope">
						<div class="theme_color crpr" @click="toDetail(scope.row.order_id)">{{ scope.row.order_id }}
						</div>
					</template>
				</el-table-column>
				<el-table-column label="下单人" align="center" width="190">
					<template slot-scope="scope">
						<div class="dflex_vertical_c">
							<el-image class="headimg_small"
								:src="scope.row.order_member_headimg || 'https://7463-tcb-rflrz31u8yan4rr9ad60d-268679-1308293149.tcb.qcloud.la/1659579992133_0.png'"
								:preview-src-list="scope.row.previewImgs" fit="contain"></el-image>
							<div class="margin_l_5 ellipsis_2 left_just">{{ scope.row.order_member_name || '--' }}</div>
						</div>
					</template>
				</el-table-column>
				<el-table-column label="订单总额" align="center" min-width="120">
					<template slot-scope="scope">
						<div class="price">{{ scope.row.order_total_money / 100 }}</div>
					</template>
				</el-table-column>
				<el-table-column label="实际付款" align="center" min-width="120">
					<template slot-scope="scope">
						<div class="price">{{ scope.row.order_actural_paid / 100 }}</div>
					</template>
				</el-table-column>
				<el-table-column property="order_goods_cnt" label="商品数量" align="center"></el-table-column>
				<el-table-column property="order_type" label="订单类型" align="center"></el-table-column>
				<el-table-column property="state" label="订单状态" align="center"></el-table-column>
				<el-table-column label="下单人手机号" align="center" min-width="120">
					<template slot-scope="scope">
						<div>{{ scope.row.order_member_mobile || '--' }}</div>
					</template>
				</el-table-column>
				<el-table-column property="create_time" label="下单时间" align="center" min-width="180"></el-table-column>
				<el-table-column label="支付方式" align="center" min-width="100">
					<template slot-scope="scope">
						<div>{{ scope.row.order_pay_way || '--' }}</div>
					</template>
				</el-table-column>
				<el-table-column property="order_consignee" label="收货人" align="center" min-width="120">
				</el-table-column>
				<el-table-column property="order_consignee_tel" label="收货人手机号" align="center" min-width="130">
				</el-table-column>
				<el-table-column property="order_from" label="订单来源" align="center"></el-table-column>
				<el-table-column property="is_fxs" label="分销" align="center"></el-table-column>
				<el-table-column label="操作" align="center" fixed="right" min-width="122">
					<template slot-scope="scope">
						<el-tooltip v-if="scope.row.state == '待付款'" :open-delay="350" content="修改订单价格" placement="top"
							:hide-after="1000" :enterable="false" effect="light">
							<el-button circle size="medium" icon="iconfont iconxiugaijiage" class="table-btn"
								@click="orderChange(scope.row, '待付款')"></el-button>
						</el-tooltip>
						<el-tooltip v-if="scope.row.state == '待发货'" :open-delay="350" content="用户已支付" placement="top"
							:hide-after="1000" :enterable="false" effect="light">
							<el-button circle size="medium" icon="el-icon-bicycle" class="table-btn"
								@click="orderChange(scope.row, '待收货')"></el-button>
						</el-tooltip>
						<el-tooltip v-if="scope.row.state == '待收货'" :open-delay="350" content="用户已收货" placement="top"
							:hide-after="1000" :enterable="false" effect="light">
							<el-button circle size="medium" icon="el-icon-box" class="table-btn"
								@click="orderChange(scope.row, '待评价')"></el-button>
						</el-tooltip>
						<el-tooltip v-if="scope.row.state == '售后中'" :open-delay="350" content="处理售后" placement="top"
							:hide-after="1000" :enterable="false" effect="light">
							<el-button circle size="medium" icon="el-icon-thumb" class="table-btn"
								@click="orderChange(scope.row, '售后中')"></el-button>
						</el-tooltip>
						<el-tooltip :open-delay="350" content="详情" placement="top" :hide-after="1000" :enterable="false"
							effect="light">
							<el-button circle size="medium" icon="el-icon-more-outline" class="table-btn"
								@click="toDetail(scope.row.order_id)"></el-button>
						</el-tooltip>
					</template>
				</el-table-column>
				<div slot="empty">
					<el-empty description=" "></el-empty>
				</div>
			</el-table>
			<el-pagination background :current-page="req.page" :page-sizes="[10, 20, 30, 50, 100]" :page-size="req.rows"
				layout="total, sizes, prev, pager, next, jumper" :total="tableTotal" @size-change="sizeChange"
				@current-change="currentChange"></el-pagination>
		</div>
		<el-drawer title="改价" size="500px" :visible.sync="priceDrawer" direction="rtl" :append-to-body="true"
			:wrapperClosable="false" @open="priceDrawerOpen">
			<el-form class="add_edit" :model="priceForm" :rules="priceRules" ref="priceRuleForm" label-width="100px">
				<el-form-item label="价格" prop="order_actural_paid" ref="order_actural_paid">
					<el-input v-model.number="priceForm.order_actural_paid" placeholder="请输入价格" type="number" :min="0"
						clearable oninput="value = parseInt(value)"></el-input>
					<div class="remark_txt">单位分 实际金额 {{ priceForm.order_actural_paid / 100 }} 元</div>
				</el-form-item>
				<el-form-item label="改价原因">
					<el-input type="textarea" placeholder="请输入改价原因" :autosize="{ minRows: 3 }"
						v-model="priceForm.remark"></el-input>
				</el-form-item>
				<el-form-item>
					<el-button :loading="priceLoading" round icon="el-icon-check" class="confirm-btn"
						@click="submitPriceForm('priceRuleForm')">提交</el-button>
					<el-button round icon="el-icon-back" class="return-btn" @click="priceDrawer = false">返回</el-button>
				</el-form-item>
			</el-form>
		</el-drawer>
		<el-drawer title="发货" size="500px" :visible.sync="expressDrawer" direction="rtl" :append-to-body="true"
			:wrapperClosable="false" @open="expressDrawerOpen">
			<el-form class="add_edit" :model="expressForm" :rules="expressRules" ref="expressRuleForm"
				label-width="100px">
				<el-form-item label="快递公司">
					<el-radio-group v-model="expressForm.order_type">
						<el-radio label="发货订单">发货订单</el-radio>
						<el-radio label="虚拟订单">虚拟订单</el-radio>
					</el-radio-group>
				</el-form-item>
				<el-form-item label="快递公司" v-if="expressForm.order_type == '发货订单'">
					<el-select v-model="expressForm.order_express" placeholder="请选择">
						<el-option v-for="item in expressOptions" :key="item.value" :label="item.label"
							:value="item.value"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="快递单号" prop="order_express_no" ref="order_express_no"
					v-if="expressForm.order_type == '发货订单'">
					<el-input v-model="expressForm.order_express_no" placeholder="请输入快递单号" clearable></el-input>
				</el-form-item>
				<el-form-item>
					<el-button :loading="expressLoading" round icon="el-icon-check" class="confirm-btn"
						@click="submitExpressForm('expressRuleForm')">提交</el-button>
					<el-button round icon="el-icon-back" class="return-btn" @click="expressDrawer = false">返回
					</el-button>
				</el-form-item>
			</el-form>
		</el-drawer>
	</div>
</template>

<script>
	import vCountup from 'vue-countupjs';
	const __name = 'wmzmall-order';
	const __log = 'wmzmall-order-log';
	export default {
		components: {
			vCountup
		},
		data() {
			return {
				state: '全部',
				stateObj: {
					待付款: 0,
					待发货: 0,
					待收货: 0,
					待评价: 0,
					已完成: 0,
					已取消: 0,
					售后中: 0,
					售后结束: 0,
					全部: 0
				},
				stateDatas: [],
				diff: 0,
				advancedHeight: 0,
				advancedSearch: false,
				searchTime: [],
				payOptions: [{
						value: '',
						label: '全部'
					},
					{
						value: '微信支付',
						label: '微信支付'
					},
					{
						value: '支付宝',
						label: '支付宝'
					}
				],
				pickerTimeOptions: {
					disabledDate(time) {
						return time.getTime() > Date.now();
					},
					shortcuts: [{
							text: '最近一周',
							onClick(picker) {
								const end = new Date();
								const start = new Date();
								start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
								picker.$emit('pick', [start, end]);
							}
						},
						{
							text: '最近一个月',
							onClick(picker) {
								const end = new Date();
								const start = new Date();
								start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
								picker.$emit('pick', [start, end]);
							}
						},
						{
							text: '最近三个月',
							onClick(picker) {
								const end = new Date();
								const start = new Date();
								start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
								picker.$emit('pick', [start, end]);
							}
						}
					]
				},
				req: {
					page: 1,
					rows: 10,
					orderby: '',
					state: '',
					order_id: '',
					order_member_name: '',
					order_member_mobile: '',
					order_consignee: '',
					order_consignee_tel: '',
					order_pay_way: '',
					begin_time: '',
					end_time: ''
				},
				tblHeight: 0,
				tableLoading: false,
				tableDatas: [],
				tableTotal: 0,
				selectDatas: [],
				priceDrawer: false,
				priceDataId: '',
				priceLoading: false,
				expressDrawer: false,
				expressDataId: '',
				expressLoading: false,
				expressOptions: [{
						value: '顺丰速运',
						label: '顺丰速运'
					},
					{
						value: '中通快递',
						label: '中通快递'
					},
					{
						value: '圆通快递',
						label: '圆通快递'
					},
					{
						value: '韵达快递',
						label: '韵达快递'
					},
					{
						value: '申通快递',
						label: '申通快递'
					},
					{
						value: '百世快递',
						label: '百世快递'
					}
				],
				priceForm: {
					order_actural_paid: 0,
					remark: ''
				},
				expressForm: {
					order_type: '发货订单',
					order_express: '顺丰速运',
					order_express_no: '',
					state: ''
				},
				orderData: {},
				user: {},
				priceRules: {
					order_actural_paid: [{
						required: true,
						message: '请输入价格',
						trigger: 'change'
					}]
				},
				expressRules: {
					order_express_no: [{
						required: true,
						message: '请输入快递单号',
						trigger: 'change'
					}]
				},
				searchBtnLoading: false,
				exportsBtnLoading: false
			};
		},
		methods: {
			async loadData(callback) {
				this.tableLoading = true;

				this.stateDatas = [];
				for (let key in this.stateObj) {
					this.stateDatas.push({
						name: key,
						cnt: this.stateObj[key]
					});
				}

				this.req.begin_time = '';
				this.req.end_time = '';

				if (this.searchTime && this.searchTime.length > 0) {
					this.req.begin_time = this.searchTime[0].getTime();
					this.req.end_time = this.searchTime[1].getTime() + (60 * 60 * 24 - 1) * 1000;
				}

				if (this.state == '全部') {
					this.req.orderby = 'create_time desc';
				} else {
					this.req.orderby = 'last_modify_time desc';
				}

				await this.$db[__name]
					.where({
						is_delete: 0
					})
					.whereif(this.req.state && this.req.state != '全部', {
						state: this.req.state
					})
					.whereif(this.req.order_id, {
						order_id: new RegExp(this.$api.filterRegexpKey(this.req.order_id), 'i')
					})
					.whereif(this.req.order_member_name, {
						order_member_name: new RegExp(this.$api.filterRegexpKey(this.req.order_member_name), 'i')
					})
					.whereif(this.req.order_member_mobile, {
						order_member_mobile: new RegExp(this.$api.filterRegexpKey(this.req.order_member_mobile),
							'i')
					})
					.whereif(this.req.order_consignee, {
						order_consignee: new RegExp(this.$api.filterRegexpKey(this.req.order_consignee), 'i')
					})
					.whereif(this.req.order_consignee_tel, {
						order_consignee_tel: new RegExp(this.$api.filterRegexpKey(this.req.order_consignee_tel),
							'i')
					})
					.whereif(this.req.order_pay_way, {
						order_pay_way: this.req.order_pay_way
					})
					.whereif(this.searchTime && this.searchTime.length > 0, {
						create_time: this.$db.$cmd.gte(this.req.begin_time).and(this.$db.$cmd.lte(this.req
							.end_time))
					})
					.withgroup({
						field: 'state',
						obj: this.stateObj
					})
					.totable(this.req)
					.then(res => {
						console.log(res)
						if (res.code == 200) {
							if (res.datas.group && res.datas.group.datas) {
								this.stateDatas = res.datas.group.datas;
							}

							res.datas.rows.forEach((row, idx) => {
								row.previewImgs = [(row.order_member_headimg && row.order_member_headimg
										.replace("/132", "/0")) ||
									'https://7463-tcb-rflrz31u8yan4rr9ad60d-268679-1308293149.tcb.qcloud.la/1659579992133_0.png'
								];
								row.create_time = new Date(row.create_time).format();
							});

							this.tableDatas = res.datas.rows;
							this.tableTotal = res.datas.total;

							if (typeof callback === 'function') {
								callback();
							}
						}
						this.searchBtnLoading = false;
						this.tableLoading = false;
					}).catch(() => {
						this.searchBtnLoading = false;
						this.tableLoading = false;
					})
			},
			search() {
				this.req.page = 1;
				this.$api.storagePaginationPage(this.req.page, this.$route.path);
				this.searchBtnLoading = true;

				this.loadData(() => {
					this.$refs.etbl.bodyWrapper.scrollTop = 0;
				});

				uni.setStorage({
					key: '__search' + this.$route.path,
					data: this.req
				});
			},
			toDetail(order_id) {
				uni.navigateTo({
					url: `/pages/order/order/detail?order_id=${order_id}&flag=order_list&tab=订单详情`,
					events: {
						refreshData: () => {
							this.loadData();
						}
					}
				});
			},
			selectionChange(datas) {
				this.selectDatas = datas;
			},
			exports() {
				if (this.selectDatas.length <= 0) {
					this.$message('请勾选需要导出的数据！');
					return;
				}

				let ids = this.selectDatas.map(x => x._id);

				this.$confirm('此操作将导出勾选数据！', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.exportBtnLoading = true;
					this.$func.wmzadmin.call('order/exports', {
						ids: ids
					}).then(res => {
						if (res.code == 200) {
							fetch(res.datas.url, {
								method: 'get',
								responseType: 'blob'
							}).then(async fileRes => {
								fileRes = await fileRes.blob();
								const blob = new Blob([fileRes], {
									type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
								});
								const url = URL.createObjectURL(blob);
								let a = document.createElement('a');
								a.download = res.datas.name;
								a.href = url;
								a.click();

								URL.revokeObjectURL(url);
							});

							this.$refs.etbl.clearSelection();
						}
						this.exportsBtnLoading = false;
					});
				});
			},
			orderChange(row, sta) {
				this.orderData = row;
				if (sta == '待付款') {
					this.priceForm.order_actural_paid = row.order_actural_paid;
					this.priceForm.remark = '';
					this.priceDrawer = true;
					this.priceDataId = row._id;
					return;
				}

				if (sta == '待收货') {
					this.expressForm.order_express = '顺丰速运';
					this.expressForm.order_express_no = '';
					this.expressForm.state = sta;
					this.expressDrawer = true;
					this.expressDataId = row._id;
					return;
				}

				if (sta == '待评价') {
					this.$confirm('此操作将确认收货！', '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning'
					}).then(() => {
						this.$func.wmzadmin.call('order/received', {
							order_id: row.order_id,
							state: '待评价'
						}).then(res => {
							if (res.code == 200) {
								this.$message({
									message: '操作成功',
									type: 'success'
								});
								this.loadData();
							}
						});
					});

					return;
				}

				if (sta == '售后中') {
					uni.navigateTo({
						url: `/pages/order/refunds_dispose`
					});

					return;
				}
			},
			priceDrawerOpen() {
				if (this.$refs.priceRuleForm) {
					this.$refs.priceRuleForm.clearValidate();
				}
			},
			submitPriceForm(formName) {
				this.$refs[formName].validate((valid, obj) => {
					this.$api.set_unvalidated_form_focus(this, obj);
					if (valid) {
						this.priceLoading = true;
						this.priceForm.last_modify_time = Date.now();
						this.expressForm.deliver_time = Date.now();
						this.$db[__name].update(this.priceDataId, this.priceForm).then(res => {
							if (res.code == 200) {
								this.$db[__log]
									.add({
										order_id: this.orderData.order_id,
										log_type: '改价',
										current_state: '待付款',
										prev_state: '待付款',
										remark: '上次价格: ' + this.orderData.order_actural_paid / 100 +
											'元' + ' 当前价格: ' + this.priceForm.order_actural_paid / 100 +
											'元',
										create_uid: this.user._id,
										create_uname: this.user.username
									})
									.then(res => {
										if (res.code == 200) {
											this.$message({
												message: '改价成功',
												type: 'success'
											});
										}
										this.priceLoading = false;
									});
								this.priceDrawer = false;
								this.loadData();
							}
						});
					}
				});
			},
			expressDrawerOpen() {
				if (this.$refs.expressRuleForm) {
					this.$refs.expressRuleForm.clearValidate();
				}
			},
			submitExpressForm(formName) {
				this.$refs[formName].validate((valid, obj) => {
					this.$api.set_unvalidated_form_focus(this, obj);
					if (valid) {
						this.expressLoading = true;
						this.expressForm.last_modify_time = Date.now();
						this.$db[__name].update(this.expressDataId, this.expressForm).then(res => {
							if (res.code == 200) {
								let remark = '快递公司：' + this.expressForm.order_express + '<br/>' +
									' 快递单号：' + this.expressForm.order_express_no;
								if (this.expressForm.order_type == '虚拟订单') {
									remark = '虚拟订单，确认发货';
								}
								this.$db[__log]
									.add({
										order_id: this.orderData.order_id,
										log_type: '发货',
										current_state: '待收货',
										prev_state: '待发货',
										remark: remark,
										create_uid: this.user._id,
										create_uname: this.user.username
									})
									.then(res => {
										if (res.code == 200) {
											this.$message({
												message: '发货成功',
												type: 'success'
											});
										}
									});
								this.expressDrawer = false;
								this.loadData();
							}
							this.expressLoading = false;
						});
					}
				});
			},
			cutSta(item) {
				uni.setStorage({
					key: '__cutSta' + this.$route.path,
					data: item
				});

				this.state = item.name;
				this.req.state = item.name;
				this.req.page = 1;
				this.$api.storagePaginationPage(this.req.page, this.$route.path);

				this.loadData(() => {
					this.$refs.etbl.bodyWrapper.scrollTop = 0;
				});
			},
			advancedFilter() {
				this.advancedSearch = !this.advancedSearch;

				this.$nextTick(() => {
					if (this.advancedSearch) {
						this.diff = this.$refs.advanced.clientHeight - this.advancedHeight;
					}
					this.$refs.tbl.tableInit(this.advancedSearch ? -this.diff : this.diff);
					this.$refs.tbl.tableChange();
				});
			},
			sizeChange(size) {
				this.$api.storagePaginationRows(size, this.$route.path);
				this.req.page = 1;
				this.$api.storagePaginationPage(this.req.page, this.$route.path);
				this.req.rows = size;

				this.loadData(() => {
					this.$refs.etbl.bodyWrapper.scrollTop = 0;
				});
			},
			currentChange(current) {
				this.$api.storagePaginationPage(current, this.$route.path);
				this.req.page = current;

				this.loadData(() => {
					this.$refs.etbl.bodyWrapper.scrollTop = 0;
				});
			}
		},
		created() {
			let __search = uni.getStorageSync('__search' + this.$route.path);
			if (__search) {
				this.req = __search;
				if (this.req.order_consignee || this.req.order_consignee_tel || this.req.order_pay_way) {
					this.advancedSearch = true;
				}
				if (this.req.begin_time && this.req.end_time) {
					this.searchTime.push(new Date(this.req.begin_time), new Date(this.req.end_time));
					this.advancedSearch = true;
				}
			}

			this.user = this.$api.getUserData();

			let thisCutSta = uni.getStorageSync('__cutSta' + this.$route.path);
			this.state = '全部';
			this.req.page = 1;
			this.req.state = this.state;
			if (thisCutSta) {
				this.state = thisCutSta.name;
				this.req.state = thisCutSta.name;
			}

			this.req.page = uni.getStorageSync('__paginationPage' + this.$route.path) || 1;
			this.req.rows = uni.getStorageSync('__paginationRows' + this.$route.path) || 10;

			this.loadData(() => {
				this.$nextTick(() => {
					this.$api.scrollToStorage('.el-table__body-wrapper', this.$route.path);
				});
			});

			window.addEventListener('resize', () => {
				this.$refs.etbl && this.$refs.etbl.doLayout();
			});
		},
		mounted() {
			this.advancedHeight = this.$refs.advanced.clientHeight;

			this.$nextTick(() => {
				this.$api.scrollOnStorage('.el-table__body-wrapper', this.$route.path);
			});
		},
		updated() {
			if (!this.tblHeight) {
				this.tblHeight = this.$refs.tbl.tblHeight;
			}
		},
		onShow() {
			this.$refs.etbl && this.$refs.etbl.doLayout();
		}
	};
</script>

<style>
	.theme_color:hover {
		text-decoration: underline;
	}

	.add_edit .el-select {
		width: 60%;
	}

	.add_edit .el-input,
	.add_edit .el-textarea {
		width: 90%;
	}

	.ellipsis_2 {
		max-width: 100px;
	}

	>>>.iconxiugaijiage {
		font-size: 14px;
	}
</style>
